<script>
import { normal_option } from "../common";
import Base from "./Base";

export default {
  name: "Sankey",
  mixins: [Base],
  data() {
    return {
      defaultOption: {
        tooltip: {
          trigger: "item",
          triggerOn: "mousemove",
          formatter: (item) => {
            return item.name;
          },
          extraCssText: "max-width:500px; white-space:pre-wrap",
        },
        title: [],
        series: [
          {
            type: "sankey",
            layout: "none",
            top: 50,
            left: 40,
            layoutIterations: 0, // 自动优化列表，尽量减少线的交叉，为0就是按照数据排列
            draggable: false,
            label: {
              formatter: (item) => {
                return item.data.name.length > 10
                  ? item.data.name.slice(0, 10) + "..."
                  : item.data.name;
              },
            },
            emphasis: {
              focus: "adjacency",
            },

            data: [],
            links: [], // 节点之间的连线
          },
        ],
      },
    };
  },
  computed: {
    option: function () {
      let color =
        this.dataset.option && this.dataset.option.color
          ? this.dataset.option.color
          : [];

      this.defaultOption.series[0].data = this.dataset.source;
      this.defaultOption.series[0].links = this.dataset.linksData;

      return {
        ...this.defaultOption,
        title: this.dataset.titleData,
        color,
      };
    },
  },
};
</script>
